<template>
    <div>
        <span class="welcome_home">欢迎您，{{username}}</span>
        <div class="content_home">
            <el-button @click="orders" class="card_home">账单业务</el-button>
            <el-button @click="category" class="card_home">商品业务</el-button>
            <el-button @click="account" class="card_home">用户信息</el-button>
        </div>
        
    </div>
</template>

<script>
import { jwtDecode } from 'jwt-decode'
export default {
    name:   'Home',
    data () {
        return {
            username :  jwtDecode(localStorage.getItem('token')).username 
        }
    },
    methods: {
        
        orders(){
            this.$router.push('/orderList')
        },
        category(){
            this.$router.push('/category')
        },
        account(){
            this.$router.push('/accountInfo')
        }
    }
    

}
</script>

<style scoped>
.welcome_home{
    font-size: 20px;
    padding-left: 30px;
    padding-top: 50px;
}
.content_home{
    text-align: center;
    padding-top: 70px;
}
.card_home{
    height: 200px;
    width: 200px;
    padding: 20px;
    margin: 50px;
    font-size: 30px;
    background-color: #016BA8;
    color: white;
}
</style>